<html>
<head>
<title>T12 - Human Body</title>
<style>
h1 {
font-size: 45px;
text-align: center;
}
#body {
height: 600px;
width: 500px;
margin: 0 auto;
padding: 10px;
border: 2px solid;
border-radius: 10px;
}
#head {
height: 150px;
width: 150px;
border: 1px solid;
border-radius: 50%;
background-color: rgb(238, 214, 118);
margin: 0 auto;
}
#eyes {
margin-top: 40px;
height: 15px;
width: 140px;
}
#lefteye {
margin-left: 35px;
height: 10px;
width: 24px;
float: left;
border-top: 4px solid;
}
#righteye {
margin-right: 20px;
height: 10px;
width: 24px;
float: right;
border-top: 4px solid;
}
#nose {
margin-right: 70px;
height: 35px;
width: 24px;
float: right;
border-right: 4px solid;
}
#mouth {
margin-right: 52px;
height: 20px;
width: 44px;
float: right;
border-bottom: 4px solid;
}
#neck {
height: 30px;
width: 70px;
border-radius: 10px;
border: 1px solid;
margin: 0 auto;
background-color: rgb(238, 214, 118);
}
#stomach {
height: 230px;
width: 225px;
border-radius: 10px;
border: 1px solid;
margin: 0 auto;
background-color: skyblue;
}
#sb {
height: 230px;
width: 160px;
float: left;
}
#sb1,
#sb2,
#sb3 {
height: 15px;
margin-left: 110px;
margin-top: 35px;
width: 15px;
border: 1px solid;
border-radius: 50%;
background-color: black;
}
#pocket {
float: right;
height: 40px;
width: 40px;
margin-top: 45px;
margin-right: 20px;
border: 1px solid;
background-color: black;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
#lowerbody {
height: 190px;
width: 500px;
}
#leg {
height: 150px;
width: 500px;
}
#leftleg {
height: 150px;
width: 30px;
margin-left: 180px;
background-color: black;
float: left;
}
#rightleg {
float: right;
height: 150px;
width: 30px;
margin-right: 180px;
background-color: black;
}
#shoes {
height: 40px;
width: 500px;
}
#leftshoe {
height: 30px;
width: 80px;
border-top-left-radius: 20px;
background-color: darkcyan;
float: left;
margin-left: 130px;
}
#rightshoe {
height: 30px;
width: 80px;
border-top-right-radius: 20px;
background-color: darkcyan;
float: right;
margin-right: 130px;
}
</style>
</head>
<body>
<h1>Task 12 - Human Body</h1>
<div id="body">
<div id="head">
<div id="eyes">
<div id="lefteye"></div>
<div id="righteye"></div>
</div>
<div id="nose"></div>
<div id="mouth"></div>
</div>
<div id="neck"></div>
<div id="stomach">
<div id="sb">
<div id="sb1"></div>
<div id="sb2"></div>
<div id="sb3"></div>
</div>
<div id="pocket"></div>
</div>
<div id="lowerbody">
<div id="leg">
<div id="leftleg"></div>
<div id="rightleg"></div>
</div>
<div id="shoes">
<div id="leftshoe"></div>
<div id="rightshoe"></div>
</div>
</div>
</div>
</body>
</html>